Ext.define('ux.CustomYearMonthField', {
    extend: 'Ext.Container',
    xtype: 'custom_year_month_field',
    requires: [
    	'Ext.Label'
    ],
	constructor: function (config) {
		this.callParent(arguments); 
		this.getComponent('field-value').setHtml(config.value);
		this.getComponent('field-value').setData(config.data);
		this.getComponent('field-value').setId(config.id);
		this.getComponent('field-value').addListener({
			tap:function () {
	        	var dateStr = Ext.getCmp(config.id).getComponent('field-value').getData();
	        	var resultCallback = function(result) {
	        		var returnDate = result.datetime;
	        		if(returnDate!=null && returnDate!=""){
	    				Ext.getCmp(config.id).getComponent('field-value').setHtml(returnDate.substring(0,7));
	                    Ext.getCmp(config.id).getComponent('field-value').setData(returnDate.substring(0,7));
	                    if(config.id == "salesProgressBeginMonth" || config.id == "salesProgressEndMonth"){
	                    	custom.salesProgressView(1);
	                    }
	        		}
	        	};
	        	var curDate = new Date();
	        	var day = curDate.getDate();
	        	if(Number(day)<10){
	        		day = "0"+day;
	        	}
	        	navigator.datetimepicker.datepicker(resultCallback, ['確定','取消'],dateStr+"-"+day);
    		}, 
    		element:'element'
    	});
	},
	
    config: {
		layout: {
			type: 'hbox'
		},
		style: 'margin-top:0.35rem;height:1.5rem;line-height:1.5rem;border: 1px solid #B9B9B9;border-radius:5px;background-image: url(./resources/images/select_date.png);background-repeat:no-repeat;background-position:center;background-size:0.5rem;background-position-x:95%;padding-left:0.2rem;',
		items: [{
			flex : 1,
			xtype: 'label',
			itemId: 'field-value',
			id: '',
			data: '',
			listeners: {
				element : 'element',
				tap : function () {
				
				}
			}
		}]
	}
});